<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./din-pro-cond-cufonfonts-webfont/style.css">
    <link rel="stylesheet" href="./css/GlobalStyle.css">
    <link rel="stylesheet" href="./css/Titel.css">
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./font/font.css">
    <script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <script src="./script/nvabar.js"></script>
    <script>
        if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)))
            window.location.href = "./MobilIndex/Mindex.html";
    </script>
</head>

<body>
    <nav class="navbar" role="navigation">
        <div class="container">
            <img id='logo' src="./Logo/logo.svg" alt="">
            <div class='navbox'>
                <ul class='nav'>
                    <!-- <script> -->
                    <li class='navlist'><a class='' href='./html/IntroductionOfCollege.html'>学院介绍</a></li>
                    <li class='navlist'>教育教学</li>
                    <li class='navlist'>学生工作</li>
                    <li class='navlist'>科研成果</li>
                    <li class='navlist'>合作交流</li>
                    <li class='navlist'>社会服务</li>
                    <li class='navlist'><a href='./html/Gallery.html'>作品展示</a></li>
                    <!-- </script> -->
                    <li class="navspace"></li>
                    <li class="navbutton">
                        <img id="search" src="./icons/search.svg" alt="">
                    </li>
                </ul>
            </div>
        </div>
    </nav>
    <div class="Carouselbox">
        <div class='CarouselboxImg' style="background: url('./img/首页banner/新媒体中心 王冰.jpg');"></div>
        <div class="CarouselboxTitleAndButton">
            <div class="CarouselboxTitle">
                <div class='Carouseltext'>
                    <span ID='CarouselTitle'>照片标题</span>
                    <span class='CarouselName'>刘璐</span>
                    <span class='CarouselName'>摄影</span>
                </div>
                <ul class="CarouselButtons">
                    <li class="CarouselButton"></li>
                    <li class="CarouselButton"></li>
                    <li class="CarouselButton"></li>
                    <li class="CarouselButton"></li>
                </ul>
            </div>
        </div>
    </div>
    <div class='Main'>
        <!-- navbar-default navbar-fixed-top -->
        <div class="NewsAndHeadlines">
            <div class="News">
                <div class="Titel">学院头条</div>
                <div class="TitelBack">SPOTLIGHT</div>
                <div class="NewsImg">
                    <img src="./img/首页新闻图片.jpg" alt="">
                </div>
                <div class="NewsHeadlineAndNewsTime">
                    <div class="NewsHeadline">学院设计系举行“不忘初心，牢记使命”主题教育党员···</div>
                    <div class="NewsTime">2019.11.14</div>
                    <div class="NewsAuthor">罗婉娇 图</div>
                </div>
            </div>
            <div class="Headlines">
                <div class="Titel HeadlinesTitel" id="Titel">学院新闻</div>
                <div class="Titel HeadlinesTitel" id="TitelBackTitel">通知公告</div>
                <div class="HeadlinesNewsTitels">
                    <div class="HeadlinesNews">
                        <div class="HeadlinesNewsTitel">
                            农业生产一线亦是战“疫”一线 农大专家教授躬身入局（图组）
                        </div>
                        <div class="HeadlinesNewsTime">2.24</div>
                        <div class="HeadlinesNewsYear">2020</div>
                    </div>
                    <div class="HeadlinesNews">
                        <div class="HeadlinesNewsTitel">
                            全国人民代表大会常务委员会关于全面禁止非法野生动物交易、个数滥食野生···
                        </div>
                        <div class="HeadlinesNewsTime">2.24</div>
                        <div class="HeadlinesNewsYear">2020</div>
                    </div>
                    <div class="HeadlinesNews">
                        <div class="HeadlinesNewsTitel">
                            坚决把四线共和行动统一到党中央决策部署上来
                        </div>
                        <div class="HeadlinesNewsTime">2.24</div>
                        <div class="HeadlinesNewsYear">2020</div>
                    </div>
                    <div class="HeadlinesNews">
                        <div class="HeadlinesNewsTitel">
                            封住的是疫情，传递的是真情——学校为长沙市公共卫生救治中心捐赠生活物资
                        </div>
                        <div class="HeadlinesNewsTime">2.24</div>
                        <div class="HeadlinesNewsYear">2020</div>
                    </div>
                    <div class="HeadlinesNews">
                        <div class="HeadlinesSeeAllNews">
                            查看全部新闻
                            <img src="./icons/chevron_right-24px.svg" alt="">
                        </div>
                    </div>
                </div>
                <script>
                    $(".HeadlinesTitel").click(
                        function () {
                            index = $(".HeadlinesTitel").index(this);
                            classname = document.getElementsByClassName("HeadlinesTitel");

                            // classname[index].id = 'TitelBackTitel';
                            // alert(index)
                            if (classname[index].id == 'TitelBackTitel') {
                                if (index == 0) {
                                    classname[0].id = 'Titel';
                                    classname[1].id = 'TitelBackTitel';
                                    textchange(classname, index)
                                } else if (index == 1) {
                                    classname[0].id = 'TitelBackTitel';
                                    classname[1].id = 'Titel';
                                    textchange(classname, index)
                                }
                            }
                        }

                    );

                    function textchange(classname, index) {
                        HeadlinesNewsTitel = document.getElementsByClassName("HeadlinesNewsTitel");
                        HeadlinesNewsTime = document.getElementsByClassName("HeadlinesNewsTime");
                        HeadlinesNewsYear = document.getElementsByClassName("HeadlinesNewsYear");
                        HeadlinesNewsList = [
                            [
                                ['农业生产一线亦是战“疫”一线 农大专家教授躬身入局（图组）', '2.24', '2020']
                            ],
                            [
                                ['湖南农业大学2018-2019学年本科教学质量报告', '12.31', '2019']
                            ]
                        ]
                        // alert(HeadlinesNewsList[index][0]);
                        for (i = 0; i < 1; i++) {
                            HeadlinesNewsTitel[0].innerHTML = HeadlinesNewsList[index][i][0];
                            HeadlinesNewsTime[0].innerHTML = HeadlinesNewsList[index][i][1];
                            HeadlinesNewsYear[0].innerHTML = HeadlinesNewsList[index][i][2];
                        }
                    }
                </script>
            </div>
        </div>
        <div class="StudentWorks">
            <div style="margin-left: 50px;">
                <div class="Titel">学生作品</div>
                <div class="TitelBack">PROTFOLIO</div>
            </div>
        </div>
    </div>
    <div>
        <table class="StudentWorksTable" border="0" cellspacing='4px'>
            <tr>
                <th class="StudentWorksTableImg">
                    <img src="./img/首页学生作品/作品1.jpg" alt="">
                </th>
                <th class="StudentWorksTableImg">
                    <img src="./img/首页学生作品/作品1.jpg" alt="">
                </th>
                <th class="StudentWorksTableImg">
                    <img src="./img/首页学生作品/作品1.jpg" alt="">
                </th>
                <th class="StudentWorksTableImg">
                    <img src="./img/首页学生作品/作品1.jpg" alt="">
                </th>
            </tr>
            <tr>
                <th class="StudentWorksTableImg">
                    <img src="./img/首页学生作品/作品1.jpg" alt=""></th>
                <th class="StudentWorksTableImg"></th>
                <th class="StudentWorksTableImg"></th>
                <th class="StudentWorksTableImg"></th>
            </tr>
            <tr>
                <th class="StudentWorksTableImg"></th>
                <th class="StudentWorksTableImg"></th>
                <th class="StudentWorksTableImg"></th>
                <th class="StudentWorksTableImg"></th>
            </tr>
            <tr>
                <th class="StudentWorksTableImg"></th>
                <th class="StudentWorksTableImg"></th>
                <th class="StudentWorksTableImg"></th>
                <th class="StudentWorksTableImg"></th>
            </tr>
        </table>
    </div>
    <div class='Main'>
        <div class="Thematic">
            <div class="ThematicAVTIVITES">
                <div class="Titel">专题专栏</div>
                <div class="TitelBack">AVTIVITES</div>
            </div>
            <div class="ThematicTitels">
                <div class="ThematicTitel">
                    <div class="ThematicTitelNum">1.</div>
                    <div class="ThematicTitelName">不忘初心，牢记使命</div>
                </div>
                <div class="ThematicTitel">
                    <div class="ThematicTitelNum">2.</div>
                    <div class="ThematicTitelName">学习十九大</div>
                </div>
                <div class="ThematicTitel">
                    <div class="ThematicTitelNum">3.</div>
                    <div class="ThematicTitelName">“两学一做”学习教育</div>
                </div>
                <div class="ThematicTitel">
                    <div class="ThematicTitelNum">4.</div>
                    <div class="ThematicTitelName">某个专题活动</div>
                </div>
            </div>
        </div>
    </div>
    <div class="footer">
        <div class="SuspensionLogo">
            <img class="footerLogo" src="./Logo/学校 logo.svg" alt="">
            <div
                style="width: 1px;margin-left: 28px;margin-right: 28px;display: inline-block;height: 44px;background-color: #bbbbbb;">
            </div>
            <img class="footerLogo" src="./Logo/景艺 logo.svg" alt="">
            <div class="FooterAddress">
                <p>地址 湖南省长沙市芙蓉区农大路1号 410001</p>
                <p>电话 (0731) 8461 8001</p>
            </div>
            <div class="FooterWechatAndWeibo">
                <div class="wechat">
                    <div class="wechatIMG">
                        <img src="./New Folder With Items/IMG_9450.JPG">
                    </div>
                    <img src="./New Folder With Items/wechat.svg" alt="">
                </div>
                <div class="weibo">
                    <img src="./New Folder With Items/weibo.svg" alt="">
                </div>
            </div>
        </div>
    </div>
    <div class="Suspension">
        © 2002-2020 湖南农业大学 Hunan Agricultural University | 湘教 QS3-200504-000029 | 湘ICP备 05000003号 | 湘公网备案
        43010202001068号
    </div>
</body>
<script>
    var index = 0;
    links = ['./img/首页banner/新媒体中心 王冰.jpg',
        './img/首页banner/新媒体中心 徐予可.jpg',
        './img/首页banner/新媒体中心 王冰.jpg',
        './img/首页banner/新媒体中心 徐予可.jpg'
    ];
    Carouseltext = [
        ['照片标题', '刘璐', '摄影'],
        ['照片标题', '徐予可', '摄影'],
        ['照片标题', '刘璐', '摄影'],
        ['照片标题', '徐予可', '摄影']
    ]

    function setvule(index) {
        document.getElementById("CarouselTitle").innerHTML = Carouseltext[index][0];
        document.getElementsByClassName("CarouselName")[0].innerHTML = Carouseltext[index][1];
        document.getElementsByClassName("CarouselName")[1].innerHTML = Carouseltext[index][2];
    }

    function crtlbutton(index) {
        for (i = 0; i < 4; i++) {
            if (i == index) {
                $('.CarouselButton').eq(i).css({
                    'background-color': 'rgba(255, 255, 255, 0.8)'
                })
            } else {
                $('.CarouselButton').eq(i).css({
                    'background-color': 'rgba(255, 255, 255, 0.4)'
                })
            }
        }
    }

    $(".CarouselButton").click(
        function () {
            index = $(".CarouselButton").index(this);
            // $('.CarouselboxImg').attr('src', links[index]);
            $('.CarouselboxImg').css({
                'background': 'url(' + '"' + links[index] + '"' + ')',
                'background-size': '100%'
            })
            crtlbutton(index)
            setvule(index)
        }

    );
    $(document).ready(
        function cycle() {
            $('.CarouselButton').eq(0).css({
                'background-color': 'rgba(255, 255, 255, 0.8)'
            })
            setInterval(function () {
                // $('.CarouselboxImg').attr('src', links[index]);
                // index = $(".CarouselButton").index(this);
                if (index == 3) {
                    index = 0;
                } else {
                    index = index + 1;
                }
                $('.CarouselboxImg').css({
                    'background': 'url(' + '"' + links[index] + '"' + ')',
                    'background-size': '100%'
                })
                crtlbutton(index)
                setvule(index)
            }, 5000);
        }
    );
</script>

</html>